<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <script>
    // 循环结构  => 简单的来说: 重复的做一件事
    // 在满足特定条件的情况下,重复的执行某个代码段 直到条件不满足为止
    // while    do...while   for   

    // while(表达式){  //  表达式 => 循环条件
    //     循环体; // 在满足特定条件的情况下,重复的执行某个代码段
    // }

    // 循环的三要素  (适用于大部分循环)
    // 1. 初始值          i = 1;         i =  10    
    // 2. 循环条件        i <= 10;       i >= 1
    // 3. 自增/自减       i ++;          i--  

    // 变量i的作用
    // 1. 作为初始值(开始位置)  
    // 2. 记录循环的位置 (每次循环的位置 => 循环到那个位置了)

    // 计算 1-100的和?  
    // (1) 得到1-100的数
    // (2) 求和(累加)

    // var i = 1;
    // var sum = 0; // 声明变量  记录累加的结果
    // while (i <= 100) {
    //   // i  1 2 3 4 5 6 7 8 9 ..... 100  => 记录每次循环的位置
    //   document.write(i + "<br>");
    //   // sum = sum + i;  // 每次循环 将sum自增之后赋值给原值
    //   sum += i;

    //   i++;
    // }
    // console.log("循环结束时的i值:", i);

    // var i = 1, sum = 0;
    // i = 1 ; i <= 100  => true  执行循环语句 sum += 1 , i++   => i = 2
    // i = 2 ; i <= 100  => true  执行循环语句 sum += 2 , i++   => i = 3
    // i = 3 ; i <= 100  => true  执行循环语句 sum += 3 , i++   => i = 4
  </script>
</body>

</html>